<template>
	<view style="background-color: #F7F7F7;">
			<!-- // #ifdef MP-WEIXIN -->
		<block v-if="!info">
			<view class="force-login-wrap">
				<view class="force-login__content y-f">
					<open-data class="user-avatar" type="userAvatarUrl"></open-data>
					<open-data class="user-name" type="userNickName"></open-data>
					<view class="login-notice">为了提供更优质的服务，需要获取您的头像昵称</view>
					<button class="cu-btn author-btn" @tap="onGotUserInfo">授权并查看</button>
					<button class="cu-btn close-btn" @tap="closeAuth">暂不授权</button>
				</view>
			</view>
		</block>
			<!-- // #endif -->
		
		
		
		
		<view class="header" v-else>
			<view style="height: 180rpx;">
			</view>
			<navigator url="/pages/tab/me" class="box1 flex-box">
				<view  class="box-ohone">
					<open-data class="user-name" type="userNickName"></open-data>
				</view>
				<view class="box-headet">
					<open-data class="user-avatar" type="userAvatarUrl"></open-data>
				</view>
			</navigator>
		
			<view class="swiper-box">
				<u-swiper :list="list" mode="none" height="260rpx"></u-swiper>
			</view>
			
			<view class="add-use">
				全部应用
			</view>
			
			<view class="flex-around margin-bottom" style="">
				<!-- <navigator url="/pages/index/Home_a" open-type="switchTab" class="">
					<view class="box-image">
						<image src="../../static/index/sc.png" mode=""></image>
					</view>
					<view class="" style="text-align: center;">
						租赁商城
					</view>
				</navigator> -->
				<view @tap="goTab('/pages/flow/flowList')" class="">
					<view class="box-image">
						<image src="https://w-jinxiao.oss-cn-chengdu.aliyuncs.com/20210322/lc.png" mode=""></image>
					</view>
					<view class="" style="text-align: center;">
						流程管理
					</view>
				</view>
				<view @tap="goTab('/pages/tab/index')" class="">
					<view class="box-image">
						<image src="../../static/index/sb.png" mode=""></image>
					</view>
					<view class="" style="text-align: center;">
						设备管理
					</view>
				</view>
				<view @tap="goTab('/pages/site/index')" class="">
					<view class="box-image">
						<image src="../../static/index/cd.png" mode=""></image>
					</view>
					<view class="" style="text-align: center;">
						场地资料
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
						title: '身无彩凤双飞翼，心有灵犀一点通'
					}
				],
				info: '',
			};
		},

		onReady() {
			uni.hideLoading();
		},
		onLoad(e) {
			this.info = uni.getStorageSync('info');
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: '#ff0000',
			})

		},
		methods: {
			goTab(url) {
				uni.navigateTo({
					url,
				})
			},
			
			closeAuth() {
				this.$tools.msg('取消授权')
				uni.navigateTo({
					url: '/pages/tab/home'
				})
				this.info = true
			},
			
			onGotUserInfo(e) {
				// if (e.detail.errMsg !== 'getUserInfo:ok') return this.$tools.msg('您取消了授权！');
				// this.getToken(e.detail);
				var that = this
				uni.getUserProfile({
					lang: 'zh_CN',
					desc: '登录',
					success: (res) => {
						that.getToken(res)
					},
					fail: (res) => {
						console.log(res)
					}
				});
			},
			
			
			async getToken(info) {
				const [err, res] = await uni.login().catch(err => err);
				if (err || res.errMsg !== 'login:ok') return this.$tools.msg('登录失败！');
				this.uid = true
				uni.setStorageSync('info', info.userInfo);
				
				const data = await this.$u.post('api/Set/login', {
					code: res.code,
					nickname: info.userInfo.nickName,
					picture: info.userInfo.avatarUrl,
				});
				console.log(data,'chengg')
				uni.setStorageSync('openid', data.data.openid);
				uni.setStorageSync('picture', data.data.picture);
				uni.setStorageSync('uid', data.data.uid);
				if (!data.code) return uni.$showMsg('登录失败');
				this.info = true
				this.$forceUpdate()
				
				this.$tools.msg('用户登录成功！');
			},
			
			
		},
	};
</script>

<style lang="scss" scoped>
	.content1 {
		width: 100%;
		height: 100vh;
		background-color: #F8F8F8;
		overflow: hidden;
		.header {
			margin: 90rpx 0 90rpx 50rpx;
			// border-bottom: 1px solid #ccc;
			text-align: center;
			width: 650rpx;
			height: 300rpx;
			line-height: 450rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #EEEEEE;
		}
	
		.header image {
			width: 200rpx;
			height: 200rpx;
		}
	
		.content11 {
			margin-left: 50rpx;
			margin-bottom: 90rpx;
		}
	
		.content11 text {
			display: block;
			color: #9d9d9d;
			margin-top: 40rpx;
		}
	
		.bottom {
			border-radius: 80rpx;
			margin: 70rpx 50rpx;
			font-size: 35rpx;
		}
	}
	
	
	.header {
		width: 100%;
		height: 100vh;
		padding: 0 30rpx;
		color: #232323;
		background: #F8F8F8;

		image {
			width: 100%;
			height: 100%;
		}
		
		.box1 {
			padding: 0 10rpx;
			border-radius: 20rpx;
			
			.box-ohone {
				
			}
			
			/deep/.box-headet {
				width: 120rpx;
				height: 120rpx;
				overflow: hidden;
				border-radius: 60rpx !important;
			}
		}

		.swiper-box {
			margin: 52rpx 0;
		}

		.add-use {
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: bold
		}
		
		.box-image {
			width: 220rpx;
			height: 220rpx;
		}

	}
	
	
	
	
	
	// 小程序登录提醒
	/* #ifdef MP-WEIXIN */
	.force-login-wrap {
		position: fixed;
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		z-index: 11111;
		top: 0;
		background: linear-gradient(180deg, #2980B9 0%, #6DD5FA 98%);
		.logo-bg {
			width: 640rpx;
			height: 300rpx;
		}
		.force-login__content {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			.user-avatar {
				width: 160rpx;
				height: 160rpx;
				border-radius: 50%;
				overflow: hidden;
				margin-bottom: 40rpx;
			}
			.user-name {
				font-size: 35rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
				margin-bottom: 30rpx;
			}
			.login-notice {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 44rpx;
				width: 400rpx;
				text-align: center;
				margin-bottom: 80rpx;
			}
			.author-btn {
				width: 630rpx;
				height: 80rpx;
				background: linear-gradient(180deg, #2980B9, #6DD5FA);
				box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
				border-radius: 40rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: rgba(255, 255, 255, 1);
			}
			.close-btn {
				width: 630rpx;
				height: 80rpx;
				margin-top: 30rpx;
				border-radius: 40rpx;
				border: 2rpx solid #2980B9;
				background: none;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
			}
		}
	}
	/* #endif */
</style>
